<!--
  -    Copyright (c) 2018-2025, lengleng All rights reserved.
  -
  - Redistribution and use in source and binary forms, with or without
  - modification, are permitted provided that the following conditions are met:
  -
  - Redistributions of source code must retain the above copyright notice,
  - this list of conditions and the following disclaimer.
  - Redistributions in binary form must reproduce the above copyright
  - notice, this list of conditions and the following disclaimer in the
  - documentation and/or other materials provided with the distribution.
  - Neither the name of the pig4cloud.com developer nor the names of its
  - contributors may be used to endorse or promote products derived from
  - this software without specific prior written permission.
  - Author: lengleng (wangiegie@gmail.com)
  -->
  <template>
    <!-- 线路 -->
    <div class="layout-padding">
      <basic-container class="layout-padding-auto layout-padding-view">
        <avue-crud
          v-model='form'
          ref='crud'
          :page='page'
          :data='tableData'
          :permission='permissionList'
          :table-loading='tableLoading'
          :option='tableOption'
          :before-open='handleOpenBefore'
          @on-load='getList'
          @search-change='searchChange'
          @refresh-change='refreshChange'
          @size-change='sizeChange'
          @current-change='currentChange'
          @row-update='handleUpdate'
          @row-save='handleSave'
          @row-del='rowDel'
          @selection-change='selectionChange'
        >
          <template #menu-left>
            <el-button
              class='filter-item'
              plain
              type='primary'
              icon='el-icon-delete'
              @click='plDelete'
            >
              批量删除
            </el-button>
          </template>
          <template #relList-form='{ row }'>
            <avue-crud
              v-model='form1'
              :option='infoOption'
              :data='infoData1'
              @row-update='handleUpdate1'
              @row-save='handleSave1'
              @row-del='rowDel1'
              :before-open='handleOpenBeforea'
              class='omicheckroute'
            >
            </avue-crud>
          </template>
        </avue-crud>
      </basic-container>
    </div>
  </template>
  
  <script>
  import { fetchList, addObj, putObj, delObj, delAllObj } from '/@/api/check/omicheckroute'
  import { Session } from '/@/utils/storage';
  import { tableOption } from '/@/const/crud/check/omicheckroute'
//   import { mapGetters } from 'vuex'
  
  export default {
    name: 'omicheckroute',
    data() {
      let _this = this
      return {
        infoType: null,
        form: {},
        form1: {},
        infoOption: {
          index: true,
          searchBtn: false,
          columnBtn: false,
          refreshBtn: false,
          column: [
            {
              type: 'select',
              label: '巡检点',
              prop: 'pointId',
              dicUrl: '/api/admin/omicheckpoint/list',
              dicHeaders: {
                authorization: 'Bearer ' + Session.get('token'),
              },
              rules: [
                {
                  required: true,
                  message: '请输入路线名称',
                  trigger: 'blur'
                }
              ],
              props: {
                label: 'pointName',
                value: 'ipId'
              }
            },
            {
              type: 'number',
              label: '排序',
              prop: 'pointSort',
              sortable: true,
              rules: [
                {
                  required: true,
                  message: '请输入排序',
                  trigger: 'blur'
                }
              ],
              min: 0,
              formslot: true
            }
          ]
        },
        onlineDevlist: [],
        areaNoid: '',
        infoData1: [],
        searchForm: {},
        tableData: [],
        page: {
          total: 0, // 总页数
          currentPage: 1, // 当前页数
          pageSize: 10 // 每页显示多少条
        },
        tableLoading: false,
        tableOption: tableOption,
        selectList: []
      }
    },
    computed: {
    //   ...mapGetters(['permissions']),
      permissionList() {
        return {
        //   addBtn: this.validData(this.permissions.om_omicheckroute_add, false),
        //   delBtn: this.validData(this.permissions.om_omicheckroute_del, false),
        //   editBtn: this.validData(this.permissions.om_omicheckroute_edit, false)
        }
      }
    },
    methods: {
      selectionChange(list) {
        this.selectList = list
      },
      getList(page, params) {
        this.tableLoading = true
        fetchList(
          Object.assign(
            {
              current: page.currentPage,
              size: page.pageSize
            },
            params,
            this.searchForm
          )
        )
          .then((response) => {
            this.tableData = response.data.records
            this.page.total = response.data.total
            this.tableLoading = false
          })
          .catch(() => {
            this.tableLoading = false
          })
      },
      rowDel: function(row, index) {
        this.$confirm('是否确认删除' + row.routeName, '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        })
          .then(function() {
            return delObj(row.irId)
          })
          .then((data) => {
            this.$message.success('删除成功')
            this.getList(this.page)
          })
          .catch((cancelorerror) => {
          })
      },
      handleUpdate: function(row, index, done, loading) {
        row.relList = this.infoData1
        putObj(row)
          .then((data) => {
            this.$message.success('修改成功')
            done()
            this.getList(this.page)
          })
          .catch(() => {
            loading()
          })
      },
      handleSave: function(row, done, loading) {
        row.relList = this.infoData1
        addObj(row)
          .then((data) => {
            this.$message.success('添加成功')
            done()
            this.getList(this.page)
          })
          .catch(() => {
            loading()
          })
      },
      sizeChange(pageSize) {
        this.page.pageSize = pageSize
      },
      currentChange(current) {
        this.page.currentPage = current
      },
      searchChange(form, done) {
        this.searchForm = form
        this.page.currentPage = 1
        this.getList(this.page, form)
        done()
      },
      refreshChange() {
        this.getList(this.page)
      },
      handleOpenBefore(show, type) {
        // this.areaNoid = this.form.areaNo;
        // this.getOnlineDevlist();
        // this.handleLocation();
        if(type==='add'){
          this.form.isSort='1'
        }
        this.infoData1 = this.form.relList ? JSON.parse(JSON.stringify(this.form.relList)) : []
        show()
      },
      handleUpdate1(row, index, done, loading) {
        loading()
        this.infoData1[index]=row
        done()
      },
      handleSave1(row, done, loading) {
        loading()
        this.infoData1.push(row)
        done()
      },
      rowDel1(row, index) {
        let _this = this
        this.$confirm('是否确认删除序号为' + (index + 1) + '的点位', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        })
          .then(function() {
            _this.infoData1.splice(row.$index, 1)
          })
          .then((data) => {
            this.$message.success('删除成功')
          })
      },
      handleOpenBeforea(show, type) {
        show()
      },
      //批量删除
      plDelete() {
        if (this.selectList.length > 0) {
          this.$confirm('是否确认删除以选择的数据', '提示', {
            confirmButtonText: '确定',
            cancelButtonText: '取消',
            type: 'warning'
          })
            .then(() => {
              let ids = []
              this.selectList.forEach((data) => {
                ids.push(data.irId)
              })
              return delAllObj(ids)
            })
            .then((data) => {
              this.$message.success('删除成功')
              this.getList(this.page)
            })
            .catch((cancelorerror) => {
            })
        }
      }
    }
  }
  </script>
  
  <style lang='scss'  >
  .omicheckroute .el-table__body-wrapper{
    flex: auto;
    height: 450px;
  }
  </style>